<ul class="sidebar-widget" id="category-module">
    <div class="title">
        {{ heading_title }}
    </div>
    {% for key, category in categories %}
        <li class="panel {{ category.category_id == category_id ? 'active' : '' }}">
            <a href="{{ category.href }}" class="category-href">
                {{ category.name }}
            </a>
            {% if category.children %}
                <a class="toggle-icon" data-toggle="collapse" data-parent="#category-module" href="#category-module-{{ key }}">
                    <i class="fa fa-angle-down" aria-hidden="true"></i>
                </a>
                <ul id="category-module-{{ key }}"
                    class="panel-collapse collapse {{ category.category_id == category_id ? 'in' : '' }}  ">
                    {% for child in category.children %}
                        <li class="{{ child.category_id == child_id ? 'active' : '' }}">
                            <a href="{{ child.href }}">
                                {{ child.name }}
                            </a>
                        </li>
                    {% endfor %}
                </ul>
            {% endif %}
        </li>
    {% endfor %}
</ul>
